<!--
 * @Description: pdf功能组件
-->
<template>
  <div>
    <pdf
      ref="pdf"
      :src="url"
      :page="page"
      @progress="loadedRatio = $event"
      @page-loaded="pageLoaded($event)"
      @num-pages="total = $event"
      @error="pdfError($event)"
      @link-clicked="$event => linkClicked($event)"
    >
    </pdf>
    <slot name="pdf_page" :data="{ page, total }"></slot>
  </div>
</template>
<script>
  import pdf from 'vue-pdf'
  export default {
    components: { pdf },
    props: {
      url: { type: String, default: () => '' },
      page: { type: Number, default: () => 1 },
      linkAllow: { type: Boolean, default: () => false },
    },
    data() {
      return {
        total: 1,
        // 加载进度
        loadedRatio: 0,
        //当前页数
        curPageNum: 0,
      }
    },
    methods: {
      // 获取总页数
      getTotal() {
        return this.total
      },
      linkClicked(e) {
        if (thia.linkAllow) {
          this.page = e
        }
      },
      // 页面加载回调函数，其中e为当前页数
      pageLoaded(e) {
        this.curPageNum = e
      },
      // 其他的一些回调函数。
      pdfError(error) {
        console.error(error)
      },
    },
  }
</script>
